import React from 'react';

class CommentsInput extends React.Component {
    constructor(props) {
        super(props);
        this.displayName = 'CommentsInput';
        this.state = {
            value : ""
        }
    }

    handleTextChange (e) {
        e.preventDefault();
        let valueStr = this.refs.commentInput.value.trim();
        this.setState({
            value: valueStr
        });
    }

    handleSubmit(e) {
         e.preventDefault();
         let valueStr = this.refs.commentInput.value.trim();
         let patt = /:/;
         let start = valueStr.search(patt)+1;
         console.log( valueStr.substr(start) );

         let parentid = this.refs.commentInput.getAttribute("data-parent-id" );
         let childrenid = this.refs.commentInput.getAttribute("data-my-id");


        let data = {
            parentid: parentid,
            childrenid: childrenid ,
            text: valueStr.substr(start)
        }

        console.log( "----------------------------" );
        this.props.commentSubmit(data);
        //  发送数据后 input text 重置为空
        this.setState({
            value: ""
        });
    }

    render() {
        return (
            <div className="commentsInputBox">
                <input type="text" id="commentsInput" placeholder="输入您的看法，一起和大家讨论吧" ref="commentInput" onChange = {this.handleTextChange.bind(this)} value={this.state.value} />
                <input type="submit" value="发送" onClick={this.handleSubmit.bind(this)} />

            </div>
        );
    }
}

export default CommentsInput;
